<#macro goalItem index goalId title percent entryCount userCount 
		showActionControl="yes" showFinishButton="yes" showDeleteButton="yes" 
		showUpdateButton="yes" showWriteEntryButton="yes">	
	<script type="text/javascript">
		jQuery(document).ready(function(){
			bindShowActionControl();
		});
		
		function bindShowActionControl(){
			jQuery(".listGoal").find("a.dropIcon").each(function(){
				var $this = jQuery(this);
				var goalId = $this.attr("rel");
				$this.unbind('click').click(function(){
					var $div = jQuery("div.goalSettingPopup[rel="+goalId+"]");
					if($div.css("display") == "none"){
						$div.fadeIn();
					}else{
						$div.fadeOut();
					}
					return false;
				});
			});
			
			jQuery("a.closePopup").unbind('click').click(function(){
				jQuery(this).parent().fadeOut();
				return false;
			});			
		}
	</script>
	<div class="goal_list">		  		
  		<div class="listnumber">${index}</div>                
  		<div class="listGoal">
            <#if (title?length>30) >
            <a class="listname" rel="${goalId}" href="/goal/view/${goalId}" title="${title}">${title?substring(0, 30)}...</a>
            <#else>
            <a class="listname" rel="${goalId}" href="/goal/view/${goalId}">${title}</a>
            </#if>		          
            
            <#if showActionControl=="yes">
            <div class="dropicon">
                <a class="dropIcon" href="#" rel="${goalId}"></a>
                
                <div class="goalSettingPopup" style="display:none" rel="${goalId}">
                	<a class="closePopup bgPos"></a>
                	<ul>
                		<#if showFinishButton=="yes"> 
                    	<li>&bull; <a href="${rc.contextPath}/done/edit/${goalId}" rel="${goalId}">Hoàn thành mục tiêu</a></li>
                    	</#if>
                    	<#if showDeleteButton=="yes">
                        <li>&bull; <a class="deleteGoal" rel="${goalId}">Xóa mục tiêu</a></li>
                        </#if>
                        <#if showUpdateButton=="yes">
                        <li>&bull; <a rel="${goalId};${percent}" href="${rc.contextPath}/manageSMARTGoal.html?goalId=${goalId}">Cập nhật tiến trình thực hiện</a></li>
                        </#if>
                        <#if showWriteEntryButton=="yes">
                        <li>&bull; <a href="${rc.contextPath}/entry/add/${goalId}" rel="${goalId}">Viết nhật ký thực hiện</a></li>
                        </#if>
                    </ul>
                </div>
            </div>            
            </#if>
            <#if (entryCount > 0) >	
            	<div class="clearthis"></div>						  			
                <p>Tổng số bài viết cho mục tiêu này: <b>${entryCount}</b></p>
            </#if>
        </div>
        <div class="sum"><b>${userCount}</b> <@spring.message "macro.goalProcessTag.people"/></div>
        <div class="score1">
            <#assign itemPercent=0>
            <#if percent??>
            	<#assign itemPercent=percent/>
            	<#assign percentPX=(183*itemPercent/100)/>
            </#if>
            <div class="scoredo" rel="${goalId}">HOÀN THÀNH <b>${itemPercent}%</b></div>
            <div class="scorebar" rel="${goalId}">
            <#if percent!=0 >
              <div class="left"></div>
              <div class="center" style="width:${percentPX}px;"></div>
              <div class="right"></div>
            </#if>
            </div>
        </div>
	</div>
	<div class="w3"></div>
</#macro>